<template>
  <div class="MyLisk">
    <van-nav-bar
      @click-left="onClickLeft"
      title="我的好友"
      left-arrow
      fixed
      placeholder
    />
    <van-tabs class="channel-tabs" v-model="active" swipeable>
      <van-tab title="关注"><guanzhu-list class="listtop" /></van-tab>
      <van-tab title="粉丝"><fans-list class="listtop" /></van-tab>
    </van-tabs>
  </div>
</template>

<script>
import GuanzhuList from './components/guanzhuList'
import FansList from './components/fans-list'
export default {
  components: {
    GuanzhuList,
    FansList
  },
  data () {
    return {
      active: 0
    }
  },
  created () {},
  mounted () {},

  methods: {
    onClickLeft () {
      this.$router.back()
    }
  }
}
</script>

<style scoped lang="less">
/deep/ .channel-tabs {
  position: fixed;
  z-index: 999;
  width: 100vw;
  background: #fff;
  .van-tab--active {
    color: #000;
    font-weight: bolder;
  }
  .van-tabs__line {
    width: 70px !important;
    background-color: red;
  }
}
/deep/ .van-nav-bar__arrow {
  color: #000;
  font-size: 50px;
}
/deep/ .article-list {
  margin-top: 50px;
}

</style>
